<script setup lang="ts">
import { Expand, Fold } from "@element-plus/icons-vue";
import { useAppConfigUserStore, useAppConfigStore } from "@/stores";
const appConfigUserStore = useAppConfigUserStore();
const emitter = defineEmits<{
  (e: 'click'): void
}>()
function toggleCollapse() {
  emitter('click')
}
</script>

<template>
  <el-button
    class="my-icon-button"
    :icon="appConfigUserStore.layoutConfig.collapseSideMenu ? Expand : Fold"
    @click="toggleCollapse"
  ></el-button>
</template>

<style lang="scss" scoped>
.el-button {
  height: auto;
  padding: 0.3em;
	font-size: 16px;
}
</style>
